<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>Logan Web</title>
    </head>
    <body>
        <textarea
            style="display:block;margin-top:20px"
            id="inputArea"
            placeholder="Input log content"
            rows="2"
            cols="50"
        ></textarea>
        <button onclick="log()">Log</button>
        <button onclick="autoLog()">Autolog</button>
        <button onclick="report()">Report</button>
        <label style="display:block;margin-top:20px;">Result:</label>
        <div
            id="resultDisplay"
            style="display:block;margin-top:20px;word-wrap:break-word;word-break: break-all;white-space: pre-wrap;"
        ></div>
        <script type="text/javascript">
            window.addEventListener('error', function(e) {
                document.getElementById('resultDisplay').innerHTML +=
                    'Error!' +
                    e.message +
                    ' ' +
                    e.lineno +
                    ':' +
                    e.colno +
                    ' ' +
                    e.filename +
                    ' ' +
                    e.error +
                    '<br>';
            });
            document.getElementById('resultDisplay').innerHTML +=
                'Promise is ' +
                (window.Promise ? '' : 'not ') +
                'supported originally.' +
                '\n';
            function consoleResult(ob) {
                console.log(ob);
                document.getElementById('resultDisplay').innerHTML +=
                    (ob instanceof Error
                        ? 'Error!' + (ob.message || ob.stack)
                        : typeof ob === 'object'
                        ? JSON.stringify(ob)
                        : ob) + '\n';
            }
        </script>
        <script type="text/javascript" src="./js/logan-web.js"></script>
        <script>
            Logan.initConfig({
                reportUrl: 'http://testUrl',
                publicKey:
                    '-----BEGIN PUBLIC KEY-----\n' +
                    'MIGeMA0GCSqGSIb3DQEBAQUAA4GMADCBiAKBgG2m5VVtZ4mHml3FB9foDRpDW7Pw\n' +
                    'Foa+1eYN777rNmIdnmezQqHWIRVcnTRVjrgGt2ndP2cYT7MgmWpvr8IjgN0PZ6ng\n' +
                    'MmKYGpapMqkxsnS/6Q8UZO4PQNlnsK2hSPoIDeJcHxDvo6Nelg+mRHEpD6K+1FIq\n' +
                    'zvdwVPCcgK7UbZElAgMBAAE=\n' +
                    '-----END PUBLIC KEY-----',
                errorHandler: function(e) {
                    consoleResult(e);
                }
            });
            function log() {
                console.log('Start log');
                Logan.log(document.getElementById('inputArea').value, 1);
                console.log('Start logWithEncryption');
                Logan.logWithEncryption(
                    document.getElementById('inputArea').value,
                    1
                );
            }
            function autoLog() {
                var itemNum = 20;
                for (var i = 0; i < itemNum; i++) {
                    var plaintext = '';
                    for (var j = 0; j < 2500; j++) {
                        plaintext += Math.random()
                            .toString(36)
                            .substr(2, 8);
                    }
                    var logString = 'log' + i + ':' + plaintext;
                    console.log('Start logWithEncryption');
                    Logan.logWithEncryption(logString, 1);
                }
            }
            function report() {
                var now = new Date();
                var sevenDaysAgo = new Date(+now - 6 * 24 * 3600 * 1000);
                function timeFormat2Day(date) {
                    var Y = date.getFullYear();
                    var M = date.getMonth() + 1;
                    var D = date.getDate();
                    return (
                        Y +
                        '-' +
                        (M < 10 ? '0' + M : M) +
                        '-' +
                        (D < 10 ? '0' + D : D)
                    );
                }
                Logan.report({
                    deviceId: 'xxx' + +new Date(),
                    fromDayString: timeFormat2Day(sevenDaysAgo),
                    toDayString: timeFormat2Day(now),
                    webSource: 'browser',
                    environment: navigator.userAgent,
                    customInfo: JSON.stringify({
                        userId: 123456,
                        biz: 'Live Better'
                    })
                })
                    .then(function(result) {
                        consoleResult(JSON.stringify(result));
                    })
                    .catch(function(e) {
                        consoleResult('report failed: ' + e);
                    });
            }
        </script>
    </body>
</html>
